<template>
  <div class="page login p10">
    <div class="form">
      <div class="form-area">
        <nut-textinput
          v-model="pageAjax.data.account"
          label="账号: "
          placeholder="请输入登陆账号"
        />
      </div>
      <div class="form-area">
        <nut-textinput
          v-model="pageAjax.data.password"
          label="密码: "
          placeholder="请输入登陆密码"
          :clear-btn="true"
          :disabled="false"
        />
      </div>
      <div class="form-area">
        <nut-button block type="default" @click="rSubmitForm">
          登录
        </nut-button>
      </div>
    </div>
  </div>
</template>
<script>
import { login } from '@/api/passport.js'

export default {
  name: 'Home',
  data() {
    return {
      pageAjax: {
        loading: false,
        data: {
          account: '',
          password: ''
        }
      }
    }
  },
  methods: {
    rSubmitForm() {
      const _that = this

      if (!_that.pageAjax.data.account) {
        _that.$toast.text('账号不能为空')
        return
      }
      if (!_that.pageAjax.data.password) {
        _that.$toast.text('密码不能为空')
        return
      }

      login(_that.pageAjax.data)
        .then(resp => {
          const respData = resp.data || {}
          if (respData.code === _that.STATUS.success[0]) {
            const sid = { access_token: respData.data }
            // localStorage.setItem("sid", JSON.stringify(sid));
            sessionStorage.setItem('sid', JSON.stringify(sid))

            _that.$store.commit('setSid', sid)

            _that.$router.push({ name: 'info' })
            // _that.getUserInfo();
          } else {
            _that.$toast.fail(respData.msg || '登陆出现错误')
          }
        })
        .finally(() => {
          _that.pageAjax.loading = false
        })
    }
  }
}
</script>
<style lang="scss">
.page {
  .form {
    margin-top: 100px;
    .form-area {
      margin-top: 10px;
    }
  }
}
</style>
